<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
  <title>Puzzler</title>
  <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
  <script type="text/javascript" src="http://www.google.com/jsapi?key=ABQIAAAAwbkbZLyhsmTCWXbTcjbgbRSzHs7K5SvaUdm8ua-Xxy_-2dYwMxQMhnagaawTo7L1FE1-amhuQxIlXw"></script>
  <script type="text/javascript" src="puzzle.js"></script>
  <script type="text/javascript">
  /* <![CDATA[ */
  var ge = null;
  
  google.load('earth', '1');
  google.setOnLoadCallback(function() {
    google.earth.createInstance('map3d', initCB, failureCB);
  });
  
  function initCB(instance) {
    ge = instance;
    ge.getWindow().setVisibility(true);
    ge.getNavigationControl().setVisibility(ge.VISIBILITY_AUTO);
    
    setupPuzzle();
    setupTimer();
  }
  
  function failureCB(errorCode) {
  }
  
  /* ]]> */
  </script>
  <style type="text/css">
  /* <![CDATA[ */
  #buttons {
    text-align: center;
    font-family: Monaco, monospace;
    font-size: 12px;
  }
  
  #container {
    margin: 0 auto;
    position: relative;
    width: 800px;
    height: 500px;
  }

  #map3d {
    height: 500px;
  }
  /* ]]> */
  </style>
</head>
<body>
  <div id="buttons">
    <input type="button" onclick="window.location.reload();" value="New Game"/>
    <input type="button" onclick="resetPuzzleView();" value="Reset View"/>
    <input type="button" onmousedown="showHint(true);" onmouseup="showHint(false);" value="Hint"/>
    <span style="width: 10em;">Time: <span id="timer" style="font-weight: bold;">00:00</span></span>
  </div>
  
  <div id="container">
    <div id="map3d"></div>
  </div>

</body>
</html>
